<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <script type="text/javascript" src="./script/rem.js"></script>
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <meta content="yes" name="apple-mobile-web-app-capable">
    <meta content="yes" name="apple-touch-fullscreen">
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <link rel="stylesheet" type="text/css" href="./css/font-awesome.css" />
    <link rel="stylesheet" type="text/css" href="./css/new.css" />
    <script type="text/javascript" src="./script/aui-slide.js"></script>
    <script type="text/javascript" src="./script/jquery.min.js"></script>
    <script type="text/javascript" src="./script/doT.min.js"></script>
    <script type="text/javascript" src="./script/base.js"></script>
    <script type="text/javascript" src="./script/api.js"></script></head>
    <script type="text/javascript" src="./script/aui-tab.js" ></script>
    <script type="text/javascript" src="./script/jquery-3.2.0.js"></script>
</head>
<body>
    <style>
        /*body{background:url(image/index-bg.jpg) no-repeat; background-size:cover;}*/
        body{background:#1a1a1a; background-size:cover;}
    </style>
    <div class="index-top">

        <div class="index-box-bg" style="display: none;" id="index_box_id">
            <div class="index-box">
                <h3>您已到达升级条件，请联系工作人员！</h3>
                <div class="index-box-btn" tapmode onclick="hide_method()">
                    <div>知道了！</div>
                </div>
            </div>
        </div>

        <div class="index-top-t">
           <div class="index-top-t-l" onclick="scanner()"><img src="image/index-top-l.png"></div>
           <div class="index-top-t-m" onclick="search()"><i class="fa fa-search"></i>搜索</div>
           <div class="index-top-t-r" onclick="call()"><img src="image/new/index-top-r.png"></div>
       </div>
       <!-- 图片轮播 begin -->
       <script type="text/javascript" src="./script/slider.js"></script>
       <div id="banner">
        <div id="carousel">
            <img src="image/banner-1.png">
            <img src="image/banner-2.png">
            <img src="image/banner-3.png">
        </div>
    </div>

    <!-- 图片轮播 end -->
    <div class="index-notice">
        <img src="image/new/index-notice.jpg">
        <div class="index-notice-s" id='notification'>
            <ul>
                <li>1关于进博会青浦华漕部分地区快递暂停通知</li>
                <li>2关于进博会青浦华漕部分地区快递暂停通知</li>
                <li>3关于进博会青浦华漕部分地区快递暂停通知</li>
            </ul>
        </div>
    </div>
</div>

<ul class="index-nav">
    <li tapmode onclick="gotoCaifu();">
        <img src="image/new/icon_shangcheng_fenlei.png">
        <p>财富之路</p>
    </li>
    <li tapmode onclick="gotoKDY();">
        <img src="image/new/icon_kuai_douyun.png">
        <p>快抖云</p>
    </li>
    <li tapmode onclick="gotoGame();">
        <img src="image/new/icon_saima_youxi.png">
        <p>一品马场</p>
    </li>
    <li tapmode onclick="gotoSpecial(5,'兑换商城');">
        <img src="image/new/icon_dangyue_shangpin.png">
        <p>兑换商城</p>
    </li>
</ul>

<div class="index-1-t"><img src="image/new/index-1-t.png" alt=""></div>

<ul class="index-1">
    <li><img id="img_1" src="image/new/index-1-1.png" onclick="gotoSpecial(1,'专题');"></li>
    <li><img id="img_2" src="image/new/index-1-2.png" onclick="gotoSpecial(2,'专题');"></li>
    <li><img id="img_3" src="image/new/index-1-3.png" onclick="gotoSpecial(3,'专题');"></li>
    <li><img id="img_4" src="image/new/index-1-4.png" onclick="gotoSpecial(4,'专题');"></li>
</ul>

<div class="index-1-d" onclick="indexAd();"><img src="image/new/index-1-d.png"></div>
<div class="index-2-t">
    <img src="image/new/index-2-t.png">
    <div class="index-2-t-r" onclick="newsList();">
        更多<i class="fa fa-chevron-circle-right"></i>
    </div>
</div>
<div class="index-2">
    <ul id="list_new">
        <li>
            <!-- <img src="image/goods.jpg"> -->
            <dl>
                <dt>美国新品护肤品</dt>
                <!-- <p>2018-10-01</p> -->
                <!-- <dd>美国新品护肤品,美国新品护肤...</dd> -->
            </dl>
        </li>
    </ul>
</div>

</body>
<script type="text/javascript" src="./script/api.js"></script>
<script type="text/javascript" src="./script/index.js"></script>
<!-- 轮播图模板 -->
<script type="text/template" id="template_carousel">
  {{~it.data:value:index}}
  <img src="{{=value.picture}}" class="slide-img" data-type="{{=value.type}}" data-ext="{{=value.ext}}">
  {{~}}
</script>
<!-- 通知模板 -->
<script type="text/template" id="template_notification">
    <ul onclick="noticeDetails();">
        {{~it.data:value:index}}
        <li>{{=value.title}}</li>
        {{~}}
    </ul>
</script>
<!-- 最新消息 -->
<script type="text/template" id="template_new">
    {{~it.data:value:index}}
    <li onclick="index_web('{{=value.url}}')">
        {{=value.title}}
        <!-- <p>{{=value.keyword}}</p> -->
    </li>
    {{~}}
</script>
<script type="text/javascript">

    apiready = function(){
        indexAdType = '';
        indexAdExt = '';
        indexAdId = '';
        // 首页轮播图
        get_slider();
        // 通知
        get_notification();
        // 首页广告位
        get_gg_data();
        // 推荐商品图片
        get_goods_img();
        // 最新消息
        get_new_data();
        // 下拉刷新
        pullRefresh();
        // 升级提示框
        index_box();
    }
    
    // 首页轮播图
    function get_slider() {
        api.ajax({
            // url: webAddress + '/api/home/advertisement',
            url: webAddress + '/api/home/slides',

            method: 'get',
            data: {
                // position: 1
            }
        }, function(ret, err) {
            if (ret) {
                // alert(JSON.stringify(ret));
                var template = $api.byId('template_carousel');
                var dotFn = doT.template(template.innerHTML);
                var html = dotFn(ret);
                var list = $api.byId('carousel');
                $api.html(list, html);

                $('#carousel').carousel({
                    curDisplay: 0, //默认索引
                    autoPlay: true, //是否自动播放
                    interval: 3000 //间隔时间
                });

                // 添加点击事件
                $(".slide-img").on('click',function(){
                    type = $(this).attr('data-type');
                    ext = $(this).attr('data-ext');
                    // alert(type);
                    // alert(ext);
                    if (type == 2) {
                      api.openWin({
                        name: 'goods_details',
                        url: './goods_details.html',
                        pageParam: {
                            id: ext
                        }
                    });
                  }else if(type == 4){
                        // 跳转网页
                        api.openWin({
                            name: 'web_view',
                            url: './web_view.html',
                            pageParam: {
                              url: ext
                          }
                      });
                    }
                })
            } else {
                // alert(JSON.stringify(err));
            }
        });

    }

    // 通知
    function get_notification() {
        api.ajax({
            url: webAddress + '/api/notification/index',
            method: 'get',
            data: {}
        }, function(ret, err) {
            if (ret) {
                // alert(JSON.stringify(ret));
                var template = $api.byId('template_notification');
                var dotFn = doT.template(template.innerHTML);
                var html = dotFn(ret);
                var list = $api.byId('notification');
                $api.html(list, html);
            } else {
                // alert(JSON.stringify(err));
            }
        });
    }

    // 通知列表
    function noticeDetails(){
        api.openWin({
            name: 'notice',
            url: './notice.html',
        });
    }

    // 首页广告
    function get_gg_data() {

        api.ajax({
            url: webAddress + '/api/home/advertisement',
            method: 'get',
            data: {
                values: {
                    position: 2
                },
            }
        }, function(ret, err) {
            if (ret) {
                // alert(JSON.stringify( ret ));
                if (ret.data.length) {
                    $('.index-1-d img').attr("src", ret.data[0].picture);
                    indexAdType = ret.data[0].type;
                    indexAdExt = ret.data[0].ext;
                    indexAdId = ret.data[0].id;
                }
            } else {
                // alert(JSON.stringify(err));
            }
        });

    }

    // 推荐商品图片
    function get_goods_img(){

        api.ajax({
            url: webAddress + '/api/topic/index',
            method: 'get',
            data: {
                values: {
                },
            }
        }, function(ret, err) {
            if (ret) {
                if (ret.data) {
                // alert(JSON.stringify( ret.data[4].id ));
                for (var i = 0; i < ret.data.length; i++) {
                    if (ret.data[i].id == 1) {
                        $('#img_1').attr("src",ret.data[i].picture);
                    }else if(ret.data[i].id == 2){
                        $('#img_2').attr("src",ret.data[i].picture);
                    }else if(ret.data[i].id == 3){
                        $('#img_3').attr("src",ret.data[i].picture);
                    }else if(ret.data[i].id == 4){
                        $('#img_4').attr("src",ret.data[i].picture);
                    }
                }
            }
        } else {
                // alert(JSON.stringify(err));
            }
        });
    }

    // 点击首页广告
    function indexAd(){
        var type = indexAdType;
        var ext = indexAdExt;
        // alert(type);
        // alert(ext);
        if (type == 2) {
          api.openWin({
            name: 'goods_details',
            url: './goods_details.html',
            pageParam: {
                id: indexAdId
            }
        });
      }else if(type == 4){
            // 跳转网页
            api.openWin({
                name: 'web_view',
                url: './web_view.html',
                pageParam: {
                  url: indexAdExt
              }
          });

        }else{
        }
    }

    // 最新消息
    function get_new_data() {
        api.ajax({
            url: webAddress + '/api/article/index?page=1&row=5',
            method: 'get',
            data: {}
        }, function(ret, err) {
            if (ret) {
                // alert(JSON.stringify( ret ));
                var template = $api.byId('template_new');
                var dotFn = doT.template(template.innerHTML);
                var html = dotFn(ret);
                var list = $api.byId('list_new');
                $api.html(list, html);
            } else {
                // alert(JSON.stringify(err));
            }
        });
    }

    // 点击最新消息跳转
    function index_web(url) {
        api.openWin({
            name: 'webview',
            url: './webview.html',
            bgColor: '#fff',
            pageParam: {
                url: url
            }
        });
    }

    // 跳转专题页
    function gotoSpecial(id,title){
        // alert(id);
        api.openWin({
            name: 'special',
            url: './special.html',
            pageParam: {
                id: id,
                title: title,
            }
        });
    }

    // 跳转商城分类
    function gotoShop(){
        var setSele = 'gotoShop();';
        api.execScript({
            name: 'root',
            script: setSele,
        });
    }

    // 跳转财富之路
    function gotoCaifu(){

        api.openWin({
            name: 'money_road',
            url: './money_road.html',
            pageParam: {
                name: 'test'
            }
        });

    }

    // 跳转快抖云
    function gotoKDY(){
        // var setSele = 'gotoKDY();';
        // api.execScript({
        //     name: 'root',
        //     script: setSele,
        // });
        api.openWin({
            name: 'kdy',
            url: './kdy.html',
            pageParam: {
                name: 'test'
            }
        });
    }

    // 跳转小游戏
    function gotoGame() {

        var token = $api.getStorage('token');

        if (!token) {

            api.confirm({
                title: '提示!',
                msg: '是否登录?',
                buttons: ['确定', '取消']
            }, function(ret, err){
                if( ret ){
                    // alert( JSON.stringify( ret ) );
                    if (ret.buttonIndex == 1) {
                        api.openWin({
                            name: 'login',
                            url: './login.html',
                        });
                    }
                }else{
                    // alert( JSON.stringify( err ) );
                }
            });
            return false;
        }else{

            api.setScreenOrientation({
                orientation: 'landscape_left'
            });

            api.openWin({
                name: 'game',
                url: './game.html',
                pageParam: {
                    name: 'test'
                },
                slidBackEnabled: false,
            });
        }

    }

    // 跳转新闻列表
    function newsList(){
        api.openWin({
            name: 'index_new',
            url: './index_new.html',
            pageParam: {
                name: 'test'
            }
        });
    }

    // 下拉刷新
    function pullRefresh() {
        api.setRefreshHeaderInfo({
            // loadingImg: 'widget://image/refresh.png',
            bgColor: '#ccc',
            textColor: '#fff',
            textDown: '下拉刷新...',
            textUp: '松开刷新...'
        }, function(ret, err) {
            var setSele = 'refreshIndex();';
            api.execScript({
                name: 'root',
                script: setSele,
            });
        });
        api.refreshHeaderLoadDone(); //下拉刷新关闭
    }

    // 关闭升级提示框
    function hide_method(){
        $api.byId('index_box_id').style.display = "none";
    }

    function index_box(){
        var token = $api.getStorage('token');
        if(!token){
            return false;
        }else{
            api.ajax({
                url: webAddress + '/api/auth/info',
                method: 'get',
                data: {
                    values: {},
                },
                headers: {
                    Authorization: 'Bearer ' + token,
                    Accept: 'application/json',
                },
            }, function(ret, err) {
                if (ret) {
                    // alert( JSON.stringify( ret ) );
                    if(ret.data.upgrade_state == 0){
                        return false;
                    }else if(ret.data.upgrade_state == 1){
                        $api.byId('index_box_id').style.display = "block";
                    }
                } else {
                    // alert( JSON.stringify( err ) );
                    return false;
                }
            });
        }
    }

    function scanner() {

        var FNScanner = api.require('FNScanner');
        FNScanner.openScanner({
            autorotation: true
        }, function(ret, err) {
            if (ret) {
                // alert(JSON.stringify(ret));
            } else {
                // alert(JSON.stringify(err));
            }
        });
    }

    function search() {
        api.openWin({
            name: 'search',
            url: './search.html',
            pageParam: {
                // keyword: '雪'
            }
        });

    }

    // 拨打客服电话
    function call() {
        api.call({
            type: 'tel_prompt',
            number: '400-0247774'
        });
    }

    // // 图片轮播
    // $(function() {
    //     $('#carousel').carousel({
    //         curDisplay: 0, //默认索引
    //         autoPlay: true, //是否自动播放
    //         interval: 3000 //间隔时间
    //     });
    // });

    function user_index() {
        api.openWin({
            name: 'user_index',
            url: './user_index.html',
        });
    }
    function closeWin(){
        api.closeWin({
        });
    }
</script>
</html>